.l-full {
    position: relative;
    overflow: hidden;
    width: 100vw;
    height: 100%;
    box-sizing: border-box;
}

.l-scroll {
    height: 100%;
    overflow: hidden;
    overflow-y: auto;
}

.l-fixed {
    position: fixed;
    box-sizing: border-box;
    width: 100%;

    &__lt {
        top: 0;
        left: 0;
    }

    &__lb {
        left: 0;
        bottom: 0;
    }
}

.l-flex {
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
    align-items: center;

    &__r {
        justify-content: flex-end;
    }

    &__c {
        justify-content: center;
    }

    &__column {
        flex-direction: column;
        justify-content: center;
    }
}

.l-header {
    height: $headerHeight;
    background-color: white;
}

.l-footer {
    z-index: 10;
    height: $footerHeight;
    background-color: white;
}

.l-view {
    padding: 3vw 4vw;
    background-color: #F7F6F9;
    box-sizing: border-box;
}

.l-panel {
    border-radius: 5px;
    background-color: white;
    box-sizing: border-box;
}

.l-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.l-botpad {
    padding-bottom: constant(safe-area-inset-bottom, $footerHeight);
    padding-bottom: env(safe-area-inset-bottom, $footerHeight);
}